<script setup lang="ts">
import { onMounted, ref } from 'vue'
import SimpleCardRule from '@/views/designer/rules/SimpleCardRule.ts'
import ComponentAdderLayerRule from '@/components/ComponentAdderLayer/ComponentAdderLayerRule.ts'


const props = defineProps<{
  rule?: string | null
}>()

const designer = ref(null)
onMounted(() => {
  designer.value?.addComponent(SimpleCardRule)
  designer.value?.addComponent(ComponentAdderLayerRule)
  if (props.rule) {
    designer.value?.setRule(JSON.parse(props.rule))
  }
})
</script>

<template>
  <fc-designer-mobile ref="designer" />
</template>

<style scoped></style>
